import React from 'react'
import { useSelector, useDispatch } from 'react-redux';

const List = (props) => {
    // console.log(state);

    const list = useSelector(state => state.list)
    const dispatch = useDispatch();
    const delItem = (i) => {

        console.log(i);
        dispatch({ type: 'del_item', key: list[i].key });

    }

    return (
        <div>
            <ul>
                {/* {state.list} */}
                {list.map((val, index) =>
                    <li key={index}>
                        {val.val}
                        ---<button onClick={() => delItem(index)}>delete</button>
                    </li>)}
            </ul>
        </div>
    )
}

export default List
